<html>
<head>
<link rel="stylesheet" href="css/reset-fonts-grids.css"  />
<link rel="stylesheet" href="css/base.css"  />
<link rel="stylesheet" href="css/style.css"  />
<link rel="stylesheet" href="css/datePicker.css"  />
</head>
<body>
<div id="doc3" class="yui-t1">
  <div id="hd"> </div>
  <div id="bd">
    <div id="yui-main">
      <div class="yui-b" id="content">
        <table>
          <tr>
            <th colspan="5"> <div id="option">
                <ul>
                  <li>操作:</li>
                  <li><a href=#>删除</a></li>
                  <li class="option-spacing"></li>
                  <li>选择:</li>
                  <li><a href=#>全部</a></li>
                  <li><a href=#>不选</a></li>
                  <li class="option-spacing"></li>
                  <li>查看数据:</li>
                  <li><a href=#>全部</a></li>
                  <li><a href=# id="filter-by-date" onclick="aa()">按照日期筛选</a></li>
                  <li><a href=#>按照标签选择</a></li>
                  <li><a href=#>按照搜索条件筛选</a></li>
                </ul>
              </div>
              <div id="filter">
              	<div id="filter-by-date">
                	<label>从</label><input id='filter-from' name="filter-from" class="date-pick" />
                    <label>To</label><input id="filter-to" name="filter-to" class="date-pick" />
                </div>
              </div>
            </th>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr class="odd">
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td>去了清远旅游，发现清远鸡真的很不错哦，呵呵，吃得不少啊...!</td>
          </tr>
          <tr>
            <td><input type="checkbox" /></td>
            <td>2009-04-01</td>
            <td>-55.5</td>
            <td>旅游,吃饭</td>
            <td></td>
          </tr>
          <tr id='table-footer'>
            <td colspan="5"><div id="stat" class="floatLeft">
                <ul>
                  <li>总收入:</li>
                  <li>22520</li>
                  <li class="option-spacing"></li>
                  <li>总支出:</li>
                  <li>15524</li>
                  <li class="option-spacing"></li>
                  <li>余额:</li>
                  <li>2250</li>
                </ul>
              </div>
              <div class="paging floatRight"> <span>第&nbsp;51&nbsp;-&nbsp;100&nbsp;条数据,共&nbsp;257&nbsp;条数据&nbsp;<a href="#"><<最后一页>&nbsp;<a href="#"><后一页</a>&nbsp;<a href="#">前一页></a>&nbsp;<a href="#">最前一页>></a></span> </div></td>
          </tr>
        </table>
        
      </div>
    </div>
    <div class="yui-b" id="leftbar">
      <div id="menu">
        <ul>
          <li><a href="#" class="bold">添加记录</a></li>
          <li class="spacing"></li>
          <li class="active"><a href="#">管理账目</a></li>
          <li><a href="label.html">管理标签</a></li>
          <li><a href="schedule.html">管理安排</a></li>
          <li><a href="#">报表</a></li>
          <li><a href="#">系统设置</a></li>
          <li><a href="#">关于</a></li>
        </ul>
      </div>
    </div>
  </div>
  <div id="ft"> </div>
  <!-- pop up window -->
  <div id="mask"></div>
  <div id="add-bill">
    <div class="header">您正在添加记录......</div>
    <div class="center">
        <table>
          <tr>
            <td class="field">日期:</td>
            <td><input type="text" id='ab-date' ></td>
          </tr>
          <tr class="odd">
             <td class="field">金额:</td>
            <td><input type="text" id="ab-amount"></td>
          </tr>
          <tr>
             <td class="field">标签:</td>
            <td><input type="text" id="ab-label"></td>
          </tr>
          <tr class="odd">
             <td class="field">备注:</td>
            <td><textarea id="ab-comment"></textarea></td>
          </tr>
        </table>
    </div>
    <div class="option">
    	<a href="#">确定并添加下一条记录</a><a href="#">确定添加并关闭窗口</a><a href="#">关闭窗口</a>
    </div>
  </div>
</div>
</body>
<script src="js/jquery.js" type="text/javascript" ></script>
<script src="js/jquery.datePicker.js" type="text/javascript" ></script>
<script src="js/test-datePicker.js" type="text/javascript" ></script>
</html>